<script setup>
defineProps({
  items: Array,
});
</script>

<template>
  <aside>
    <div class="sticky top-20">
      <h3 class="text-lg font-semibold mb-4">目录</h3>
      <ul class="space-y-2">
        <li
          v-for="item in items"
          :key="item.id"
          :class="`ml-${(item.depth - 2) * 4}`"
        >
          <a :href="`#${item.id}`" class="hover:text-primary transition-colors">
            {{ item.title }}
          </a>
        </li>
      </ul>
    </div>
  </aside>
</template>
